<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/layout :: head('用户管理')}"></head>
<body>
    <!-- 导航栏 -->
    <nav th:replace="~{fragments/layout :: navbar}"></nav>
    
    <!-- 页面内容 -->
    <div th:replace="~{fragments/layout :: content(~{::main})}">
        <main>
            <h2 class="mb-4">用户管理</h2>
            
            <!-- 用户统计 -->
            <div class="row mb-4">
                <div class="col-md-4">
                    <div class="card text-white bg-primary">
                        <div class="card-body">
                            <h5 class="card-title">总用户数</h5>
                            <p class="card-text display-4" th:text="${totalUsers}">0</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card text-white bg-success">
                        <div class="card-body">
                            <h5 class="card-title">学生用户</h5>
                            <p class="card-text display-4" th:text="${studentCount}">0</p>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card text-white bg-info">
                        <div class="card-body">
                            <h5 class="card-title">管理员用户</h5>
                            <p class="card-text display-4" th:text="${adminCount}">0</p>
                        </div>
                    </div>
                </div>
            </div>
            
            <!-- 筛选表单 -->
            <div class="card mb-4">
                <div class="card-body">
                    <form th:action="@{/admin/users}" method="get" class="row g-3">
                        <div class="col-md-4">
                            <label for="keyword" class="form-label">关键词</label>
                            <input type="text" class="form-control" id="keyword" name="keyword" th:value="${param.keyword}" placeholder="用户名、姓名或邮箱">
                        </div>
                        <div class="col-md-3">
                            <label for="role" class="form-label">用户角色</label>
                            <select class="form-select" id="role" name="role">
                                <option value="">所有角色</option>
                                <option value="ADMIN" th:selected="${param.role != null && param.role[0] == 'ADMIN'}">管理员</option>
                                <option value="STUDENT" th:selected="${param.role != null && param.role[0] == 'STUDENT'}">学生</option>
                            </select>
                        </div>
                        <!-- 移除状态筛选 -->
                        <div class="col-md-2 d-flex align-items-end">
                            <button type="submit" class="btn btn-primary w-100">
                                <i class="fas fa-search me-1"></i> 搜索
                            </button>
                        </div>
                    </form>
                </div>
            </div>
            
            <!-- 用户列表 -->
            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-end mb-3">
                        <a th:href="@{/admin/users/add}" class="btn btn-success">
                            <i class="fas fa-user-plus"></i> 添加用户
                        </a>
                    </div>
                    
                    <div th:if="${#lists.isEmpty(users)}" class="text-center py-5">
                        <p class="text-muted">没有找到符合条件的用户</p>
                    </div>
                    
                    <div class="table-responsive" th:unless="${#lists.isEmpty(users)}">
                        <table class="table table-hover">
                            <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>用户名</th>
                                    <th>姓名</th>
                                    <th>电子邮箱</th>
                                    <th>角色</th>
                                    <th>注册时间</th>
                                    <!-- 移除状态列 -->
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr th:each="user : ${users}">
                                    <td th:text="${user.id}">1</td>
                                    <td th:text="${user.username}">username</td>
                                    <td th:text="${user.name}">姓名</td>
                                    <td th:text="${user.email}">email@example.com</td>
                                    <td>
                                        <span class="badge bg-secondary me-1" th:text="${user.role.name}">ROLE</span>
                                    </td>
                                    <td th:text="${#temporals.format(user.createdAt, 'yyyy-MM-dd')}">2023-01-01</td>
                                    <!-- 移除状态单元格 -->
                                    <td>
                                        <div class="btn-group">
                                            <a th:href="@{/admin/users/view/{id}(id=${user.id})}" class="btn btn-sm btn-info me-1">
                                                <i class="fas fa-eye"></i>
                                            </a>
                                            <a th:href="@{/admin/users/edit/{id}(id=${user.id})}" class="btn btn-sm btn-warning me-1">
                                                <i class="fas fa-edit"></i>
                                            </a>
                                            <!-- 删除用户按钮 -->
                                            <form th:action="@{/admin/users/{id}/delete(id=${user.id})}" method="post" class="d-inline">
                                                <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
                                                <button type="submit" class="btn btn-sm btn-danger" onclick="return confirm('确定要删除该用户吗？此操作不可恢复！')">
                                                    <i class="fas fa-trash-alt"></i>
                                                </button>
                                            </form>
                                        </div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    
                    <!-- 分页 -->
                    <nav th:if="${totalPages > 1}" class="mt-3">
                        <ul class="pagination justify-content-center">
                            <li class="page-item" th:classappend="${currentPage == 0} ? 'disabled' : ''">
                                <a class="page-link" th:href="@{/admin/users(page=${currentPage - 1}, keyword=${param.keyword}, role=${param.role}, status=${param.status})}" aria-label="上一页">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                            <li class="page-item" th:each="i : ${#numbers.sequence(0, totalPages - 1)}" 
                                th:classappend="${currentPage == i} ? 'active' : ''">
                                <a class="page-link" th:href="@{/admin/users(page=${i}, keyword=${param.keyword}, role=${param.role}, status=${param.status})}" th:text="${i + 1}">1</a>
                            </li>
                            <li class="page-item" th:classappend="${currentPage == totalPages - 1} ? 'disabled' : ''">
                                <a class="page-link" th:href="@{/admin/users(page=${currentPage + 1}, keyword=${param.keyword}, role=${param.role}, status=${param.status})}" aria-label="下一页">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </main>
    </div>
    
    <!-- 页脚 -->
    <footer th:replace="~{fragments/layout :: footer}"></footer>
    
    <!-- 脚本 -->
    <div th:replace="~{fragments/layout :: scripts}"></div>
</body>
</html>
